<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1, user-scalable=no">
		<title>标本报送</title>
		<meta http-equiv="expires" content="0">
		<meta http-equiv="pragma" content="no-cache">
		<meta http-equiv="cache-control" content="no-cache">
		<link rel="stylesheet" href="../../../css/reset.css" />
		<link rel="stylesheet" href="../../../css/mui.min.css" />
		<link rel="stylesheet" href="../../../css/iconfont.css" />
		<link rel="stylesheet" href="../../../css/cmms.css" />
		<link rel="stylesheet" href="../../../css/sale/sampDelivery/saveDelivery.css" />
	</head>
	<body>
		<div id="saveDelivery" class="mui-content center"  v-cloak>
			<div class="deliveryBox" v-if="show1">
				<ul v-for="(hospitalinfo,index) in hospitalInfoList">
					<li class="selectHospital" @tap="selectHospital(index)">
						<span>选择医院</span>
						<span>
							<input type="text" readonly unselectable="on" v-model="hospitalinfo.hospital" placeholder="请选择医院"/><i class="iconfont icon-chakangengduo"></i>
						</span>
					</li>
					<li class="singleListItem4">
						<div>
							<span>
								扫条形码
							</span>
						</div>
						<div>
							<input type="text" placeholder="请扫描或输入条形码" v-model="hospitalinfo.inputCode" @change="addBarCode(index,hospitalinfo.paramList)"/>
							<i class="icon iconfont icon-saomiao right" @tap="scanBarcode(index,hospitalinfo.paramList)"></i>
						</div>
						<ul v-show="hospitalinfo.paramList">
							<li v-for="(param,ind) in hospitalinfo.paramList">
								<p v-if="param.specimenBarcode">条码：{{param.specimenBarcode}}<i class="icon iconfont icon-shanchu" @tap="delBarCode(hospitalinfo.paramList,ind)"></i></p>
								<p>
									<span>试管数目:</span>
									<span>
										<input type="text" v-model="param.specimenNum" />个
									</span>
								</p>
							</li>
						</ul>
					</li>
				</ul>
				<div class="addHospital"><span @tap="addHospital"><i class="iconfont icon-jiahao"></i>添加医院</span></div>
				<div id="deliveryType">
					<div>
						<span>物流自送/快递寄送</span>
					</div>
					<div id="mySwitch" class="mui-switch mui-switch-blue mui-switch-mini" :class="{'mui-active':isShow}" @tap="switchActive(isShow)">
					  <div class="mui-switch-handle"></div>
					</div>
				</div>
				<ul class="expressDetail">
					<li @tap="selExpressCo" v-show="isDeliveryType">
						<span>快递公司</span>
						<span class="selected">
							<input type="text" readonly unselectable="on" v-model="expressCompany" placeholder="请选择快递公司"/><i class="iconfont icon-chakangengduo"></i>
						</span>
					</li>
					<li v-show="isDeliveryType">
						<span>快递单号</span>
						<span >
							<input type="text" v-model="expressNo" placeholder="请填写准确的快递单号"/>
						</span>
					</li>
					<li>
						<span>收件人</span>
						<span >
							<input type="text" v-model="receiverName" placeholder="请填写收件人"/>
						</span>
					</li>
					<li>
						<span>联系电话</span>
						<span >
							<input type="text" v-model="receiverMobile" placeholder="请填写收件人联系电话"/>
						</span>
					</li>
					<li><textarea  rows="5" cols="5" placeholder="请填写详细地址" v-model="receiveAddress"></textarea></li>
				</ul>
				<div class="btnBox">
					<button class="submit-btn" :class="{'hidden':isSubmit}">提交订单</button>
					<button class="submit-btn" :class="{'hidden':!isSubmit}" @tap="submitOrder">提交订单</button>
				</div>
			</div>
			<div id="selHospital"  v-if="show2">
				<!--搜素框-->
				<div class="searchTop">
					<span class=" mui-icon mui-icon-search"></span>
	    			<input v-model="hospitalName" type="text" class="mui-input-clear" placeholder="请输入医院名称">
	    			<button @tap="searchHospital" class="btn-primary">搜索</button>
				</div>
				<!--列表-->
				<ul class="ulStyle" v-if="ulShow">
				    <li @tap="jumpHospitalDetail(item.hospitalId,item.hospitalName)" v-for="item in hospitalItems">{{item.hospitalName}}</li>
				</ul>
				<div>
					<button @tap="clearItem" class="clearBtn">清除搜素记录</button>
				</div>
			</div>
			<div id="selExpress"  v-if="show3">
				<!--搜素框-->
				<div class="searchTop">
					<span class=" mui-icon mui-icon-search"></span>
	    			<input v-model="expressName" type="text" class="mui-input-clear" placeholder="请输入快递名称">
	    			<button @tap="searchExpress" class="btn-primary">搜索</button>
				</div>
				<!--列表-->
				<ul class="ulStyle" v-if="ulShow">
				    <li @tap="jumpExpressDetail(item.dataCode,item.dataName)" v-for="item in ExpressItems">{{item.dataName}}</li>
				</ul>
				<div v-if="ulShow">
					<button @tap="clearItem" class="clearBtn">清除搜素记录</button>
				</div>
			</div>
		</div>
		<script src="../../../js/mui.min.js"></script>
		<script src="../../../js/vue.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
		<script src="../../../js/cmms.js?time=3331"></script>
		<script>
			new Vue({
				el:"#saveDelivery",
				data(){
					return{
						hospital:'',
						hospitalName:'',
						inputCode:'',
						barCodeArr:'',
						cubeNum:1,//试管数量
						expressCompany:'',//快递公司
						expressCompanyCode:'',//快递公司代码
						expressName:'',
						expressNo:'',//快递编号
						receiverName:'',//收件人姓名
						receiverMobile:'',//收件人电话
						receiveAddress:'',//详细地址
						isSubmit:true,
						show1:true,
						show2:false,
						show3:false,
						ulShow:false,
						hospitalItems:[],
						ExpressItems:[],//快递
						isDeliveryType:false,//寄送方式显示状态,1物流自送:false,2快递寄送:true
						deliveryType:1,
						hospitalInfoList:[
							{	
								hospital:'',
								inputCode:'',
								hospital:'',
								paramList:[
								],
								partnerHospitalId:''
							}
						],//页面显示的医院试管信息集合
						hosptialInfo:{	
							hospital:'',
							inputCode:'',
							paramList:[
							],
							partnerHospitalId:''
						},
						hospIndex:0,
						hospitalInfoData:[
							
						],
						isShow:false,
						nameArr:[],
						idArr:[],
					}
				},
				watch:{
				},
				mounted(){
//					var vConsole = new VConsole();
					this.init();
					mui('#mySwitch')['switch']();
					console.log(this.deliveryType);
				},
				methods:{
					/*寄送方式*/
					switchActive(isShow){
						console.log(isShow);
						if(isShow){
							this.isShow = false;
							this.isDeliveryType = false;
							this.deliveryType = 1;
						}else{
							this.isShow = true;
							this.isDeliveryType = true;
							this.deliveryType = 2;
						}
					},
					init(){
						let _this = this;
						/*接口配置*/
		    			AT.muiAjax('/partner-sale/partnerSale/wxConfig','post',{url:location.href.split('#')[0]},function(res){
							wx.config({
								//debug: true,
								appId:res.appId,
								timestamp:res.timestamp,
								nonceStr:res.nonceStr,
								signature:res.signature,
								jsApiList:['scanQRCode']
							});
						});
					},
					/*选择医院*/
					selectHospital(index){
						this.show1 = false;
						this.show2 = true;
						this.show3 = false;
						this.ulShow = false;
						this.hospIndex = index;
						this.searchHospital();
					},
					//医院搜索
					searchHospital(){
						let _this = this;
						AT.muiAjax('/partner-sale/apply/getPartnerHospital','post',{
							 name:_this.hospital
						},function(realData){
							_this.ulShow = true;
							_this.hospitalItems = realData;
//							console.log(realData);
						});
					},
					clearItem(){
						this.ulShow = false;
					},
					jumpHospitalDetail(id,name){
						this.show3 = false;
						this.show2 = false;
						this.show1 = true;
//						this.hospitalInfoList[this.hospIndex].hospital = name;
//						this.hospitalInfoList[this.hospIndex].partnerHospitalId = id;
						
						if(this.nameArr.length<this.hospIndex+1){
							this.nameArr.push(name);
							this.idArr.push(id);
						}else{
							this.nameArr[this.hospIndex] = name;
							this.idArr[this.hospIndex] = id;
						}
						let obj = {
							paramList:[
							],
							partnerHospitalId:''
						}
						this.hospitalInfoData.push(obj);
						console.log(this.nameArr);
						console.log(this.idArr);
						for(let i=0;i<this.hospitalInfoList.length;i++){
							this.hospitalInfoList[i].hospital = this.nameArr[i];
							this.hospitalInfoData[i].partnerHospitalId = this.idArr[i];
						}
						console.log(this.hospitalInfoList);
						console.log(this.hospitalInfoData);
					},
					//扫描10-12位服务码
					scanBarcode(index,paramList){
						let _this = this;
						wx.scanQRCode({
							needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
							scanType: ["barCode"], // 可以指定扫二维码还是一维码，默认二者都有
							success: function (res) {
								//console.(res);
								_this.hospitalInfoList[index].inputCode = res.resultStr.split(',')[1]; 	
								if(_this.hospitalInfoList[index].inputCode.length<10||_this.hospitalInfoList[index].inputCode.length>12){
									mui.alert('条码位数必须为10~12位，请重新输入!');
								}else{
									let obj ={
										specimenBarcode:_this.hospitalInfoList[index].inputCode,
										specimenNum:1
									};
									paramList.push(obj);
								}
							}
						});
					},
					/*条码添加*/
					addBarCode(index,paramList){
						console.log(index);
						let _this = this;
						let reg=/^[A-Za-z0-9]+$/;
						console.log(_this.hospitalInfoList[index].inputCode);
						if(!reg.test(_this.hospitalInfoList[index].inputCode)){
							mui.alert('条码必须为字母、数字!');
							
						}else if(_this.hospitalInfoList[index].inputCode.length<10||_this.hospitalInfoList[index].inputCode.length>12){
							mui.alert('条码位数必须为10~12位，请重新输入!');
							
						}else{
							let obj ={
								specimenBarcode:_this.hospitalInfoList[index].inputCode,
								specimenNum:1
							};
							paramList.push(obj);
							console.log(paramList);
							_this.hospitalInfoData[index].paramList = paramList;
							
						}
					},
					/*删除条码*/
					delBarCode(paramList,ind){
						let _this = this;
						paramList.splice(ind,1);
						console.log(paramList);
					},
					/*添加医院信息*/
					addHospital(){
						let _this = this;
						console.log(_this.hospitalInfoList);
						console.log(_this.hospIndex);
						console.log(_this.hospIndex.inputCode);
						if(_this.hospitalInfoList[_this.hospIndex].hospital==''){
							mui.alert("医院不能为空！");
							return false;
						}else if(_this.hospitalInfoList[_this.hospIndex].inputCode==''){
							mui.alert("条形码不能为空！");
							return false;
						}else{
							console.log(_this.hosptialInfo);
							let obj = {
								hospital:'',
								inputCode:'',
								paramList:[
								],
								partnerHospitalId:''
							}
							_this.hospitalInfoList.push(obj);
							_this.hospIndex++;
							console.log(_this.hospIndex);
						}
						console.log(_this.hospitalInfoList);
					},
					/*选择快递公司*/
					selExpressCo(){
						let _this = this;
						_this.show1 = false;
						_this.show2 = false;
						_this.show3 = true;
						_this.searchExpress();
					},
					searchExpress(){
						let _this = this;
						AT.muiAjax('/partner-sale/apply/getExpressCompany','post',{
							name:_this.expressName
						},function(realData){
							console.log(realData);
							_this.ulShow = true;
							_this.ExpressItems = realData;
						});
					},
					jumpExpressDetail(code,name){
						this.show3 = false;
						this.show2 = false;
						this.show1 = true;
						this.expressCompany = name;
						this.expressCompanyCode = code;
					},
					submitOrder(){
						let _this = this;
						console.log(_this.hospitalInfoList);
						let obj = {
							paramList:[],
							partnerHospitalId:0
						};
						//提交所需的医院试管集合
						let hospitalInfoList = _this.hospitalInfoList;
						let arr = [];
						for(let i=0;i<_this.hospitalInfoList.length;i++){
							arr.push(obj);
							console.log(_this.hospitalInfoData);
							arr[i].paramList=_this.hospitalInfoList[i].paramList;
							arr[i].partnerHospitalId=_this.idArr[i];
							let reg=/^[A-Za-z0-9]+$/;
							if(_this.hospitalInfoList[i].hospital==''){
								mui.alert("医院名称不能为空！");
							}else if(_this.hospitalInfoList[i].inputCode==''){
								mui.alert("条码不能为空！");
							}else if(!reg.test(_this.hospitalInfoList[i].inputCode)){
								mui.alert('条码必须为字母、数字!');
							}else if(_this.deliveryType==2){
								if(_this.expressCompanyCode==''){
									mui.alert("快递公司不能为空！");
								}else if(_this.expressNo==''){
									mui.alert("快递单号不能为空！");
								}else if(_this.receiveAddress==''){
									mui.alert("收件人地址不能为空！");
								}else if(_this.receiverMobile==''){
									mui.alert("联系电话不能为空！");
								}else if(_this.receiverName==''){
									mui.alert("收件人不能为空！");
								}else{
									AT.muiAjax('/partner-sale/apply/savePartnerSpecimenDelivery','post',{
										deliveryType:_this.deliveryType,
										expressCompanyCode:_this.expressCompanyCode,
										expressNo:_this.expressNo,
										receiveAddress:_this.receiveAddress,
										receiverMobile:_this.receiverMobile,
										receiverName:_this.receiverName,
			//							remark:_this.remark,
										list:_this.hospitalInfoData
									},function(realData){
										console.log(realData);
										const timer = setTimeout(() =>{                    
											location.href = 'sampDelivery.html';
										}, 1000);  
										_this.$once('hook:beforeDestroy', () => {            
										    clearTimeout(timer);                                    
										});
									});
								}
							}else{
								if(_this.receiveAddress==''){
									mui.alert("收件人地址不能为空！");
								}else if(_this.receiverMobile==''){
									mui.alert("联系电话不能为空！");
								}else if(_this.receiverName==''){
									mui.alert("收件人不能为空！");
								}else{
									AT.muiAjax('/partner-sale/apply/savePartnerSpecimenDelivery','post',{
										deliveryType:_this.deliveryType,
										expressCompanyCode:_this.expressCompanyCode,
										expressNo:_this.expressNo,
										receiveAddress:_this.receiveAddress,
										receiverMobile:_this.receiverMobile,
										receiverName:_this.receiverName,
			//							remark:_this.remark,
										list:_this.hospitalInfoData
									},function(realData){
										console.log(realData);
										const timer = setTimeout(() =>{                    
											location.href = 'sampDelivery.html';
										}, 1000);  
										_this.$once('hook:beforeDestroy', () => {            
										    clearTimeout(timer);                                    
										});
									});
								}
							}
						}
						console.log(_this.deliveryType,_this.expressCompanyCode);
						console.log(_this.hospitalInfoList);
//						console.log(arr);
						console.log(_this.hospitalInfoData);
					},
				}	
			})
		</script>
	</body>
</html>

